<template>
<div id="" style="height:100%">
  <CellList v-if="!showMap" :tabList="tabList"></CellList>
  <!-- <Maps v-if="showMap" @changeType="changeType" :tabList="tabList"></Maps> -->
</div>
</template>
<script>
import CellList from './list/index.vue'
// import Maps from './map/index.vue'
export default {
  name: "",
  components: {
    CellList,
    // Maps
  },
  data() {
    return {
      showMap: false,
      tabList: []
    }
  },
  created() {
    this.init();
  },
  methods: {
    init() {
      this.$api.getCountByType().then(res => {
        this.tabList = res;
      })
    },
    changeType(event) {
      this.showMap = event
    }
  }
}
</script>
<style lang="scss" scoped>
.mapHeight {
    width: 100%;
    height: calc(100vh - 4rem);
}

.typeImg {
    display: inline-block;
    width: 0.8rem;
    height: 0.8rem;
}
.groundImg {
    display: inline-block;
    width: 100%;
    height: 3.5rem;
}
</style>
